<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
    <link rel="stylesheet" href="style/farbtastic.css"/>
</head>
<body>
<form><input type="text" id="color" name="color" value="#123456" /></form>

<div id="colorpicker"></div>
</body>
<script type="text/javascript" src="script/jquery.js"></script>
<script type="text/javascript" src="script/farbtastic.js"></script>
<script>
    $(document).ready(function() {

        $('#colorpicker').farbtastic('#color');

    });
</script>
</html>

<ul>
    <li>
        <fieldset style="margin: 0px; padding: 5px; max-width: 100%; color: rgb(62, 62, 62); font-size: medium; white-space: normal; border: 1px solid rgb(204, 204, 204); border-image-source: none; line-height: 24px; font-family: 宋体; orphans: 2; widows: 2; box-sizing: border-box !important; word-wrap: break-word !important; background-color: rgb(248, 247, 245);"><p style="margin-top: 0px; margin-bottom: 0px; padding: 0px; max-width: 100%; min-height: 1em; white-space: pre-wrap; overflow: hidden; box-sizing: border-box !important; word-wrap: break-word !important;"><strong style="margin: 0px; padding: 0px; max-width: 100%; line-height: 2em; color: rgb(118, 146, 60); box-sizing: border-box !important; word-wrap: break-word !important;">阅读本文用了： </strong><img src="https://mmbiz.qlogo.cn/mmbiz/ZFvUqSQ0vAk8yU7xZ8hDKgeBPSwDpcPSjawGj2ekAp1GMQLq7RibhFgicdpCXj3B8oBeMAia74e13FotEsrX7zRAw/0" data-w="16" data-ratio="2.25" width="16px" style="margin: 0px; padding: 0px; border: 0px currentcolor; border-image-source: none; box-sizing: border-box !important; word-wrap: break-word !important; width: 16px !important; visibility: visible !important; height: auto !important; background-image: none; background-attachment: scroll; background-position: 0% 0%;" _width="16px"><img src="https://mmbiz.qlogo.cn/mmbiz/ZFvUqSQ0vAk8yU7xZ8hDKgeBPSwDpcPS8UhBbKTnibWicVbs4TpCYk3u7mkKHVMwJfUXxEXeuQb0pEsicbQuyqdPw/0" data-w="17" data-ratio="2.1176470588235294" width="16px" style="margin: 0px; padding: 0px; border: 0px currentcolor; border-image-source: none; box-sizing: border-box !important; word-wrap: break-word !important; width: 16px !important; visibility: visible !important; height: auto !important; background-image: none; background-attachment: scroll; background-position: 0% 0%;" _width="16px"> <strong style="font-family: 宋体; font-size: medium; orphans: 2; white-space: pre-wrap; widows: 2; margin: 0px; padding: 0px; max-width: 100%; line-height: 2em; color: rgb(118, 146, 60); box-sizing: border-box !important; word-wrap: break-word !important; background-color: rgb(248, 247, 245);">分</strong> <img src="https://mmbiz.qlogo.cn/mmbiz/ZFvUqSQ0vAk8yU7xZ8hDKgeBPSwDpcPSwpicSWvEt3jiaepM3o5l84KT8FbQyycX580BWD8hwCZxdy3VbYpV3ylw/0" data-w="16" data-ratio="2.25" width="16px" style="margin: 0px; padding: 0px; border: 0px currentcolor; border-image-source: none; box-sizing: border-box !important; word-wrap: break-word !important; width: 16px !important; visibility: visible !important; height: auto !important; background-image: none; background-attachment: scroll; background-position: 0% 0%;" _width="16px"><img src="https://mmbiz.qlogo.cn/mmbiz/ZFvUqSQ0vAk8yU7xZ8hDKgeBPSwDpcPSmhSsibSUO9VCW5icqTkCfv5fUSzia42c3cWgRrCFZ8QE3ehpm9Tzs48icw/0" data-w="17" data-ratio="2.1176470588235294" width="16px" style="margin: 0px; padding: 0px; border: 0px currentcolor; border-image-source: none; box-sizing: border-box !important; word-wrap: break-word !important; width: 16px !important; visibility: visible !important; height: auto !important; background-image: none; background-attachment: scroll; background-position: 0% 0%;" _width="16px"><strong style="margin: 0px; padding: 0px; max-width: 100%; line-height: 2em; color: rgb(118, 146, 60); box-sizing: border-box !important; word-wrap: break-word !important;">秒，转发只需1秒</strong><br style="margin: 0px; padding: 0px; max-width: 100%; box-sizing: border-box !important; word-wrap: break-word !important;"></p><p style="margin-top: 0px; margin-bottom: 0px; padding: 0px; max-width: 100%; word-wrap: normal; min-height: 1.5em; white-space: pre-wrap; overflow: hidden; line-height: 2em; box-sizing: border-box !important;"><span style="margin: 0px; padding: 0px; max-width: 100%; color: rgb(149, 55, 52); box-sizing: border-box !important; word-wrap: break-word !important;"><strong style="margin: 0px; padding: 0px; max-width: 100%; line-height: 18px; font-family: simsun, sans-serif; box-sizing: border-box !important; word-wrap: break-word !important;"><span style="margin: 0px; padding: 0px; max-width: 100%; box-sizing: border-box !important; word-wrap: break-word !important;"><strong style="margin: 0px; padding: 0px; max-width: 100%; box-sizing: border-box !important; word-wrap: break-word !important;">❀</strong></span>转载是一种智慧<strong style="margin: 0px; padding: 0px; max-width: 100%; box-sizing: border-box !important; word-wrap: break-word !important;">❀</strong>分享是一种美德❀</strong></span></p></fieldset>
    </li>
    <li>
        <p><img style="HEIGHT: auto !important; WIDTH: auto" src="http://mmbiz.qlogo.cn/mmbiz/mj9u1OBZRqP8EvePIzqrRIHCHOzYM4ng8ykricMWXibdx2X4IHMImLJwcQeQELKh7tLvAtONSvF4r688Rhicr36VQ/0/mmbizgif"></p>
    </li>
    <li>
        <p style="margin:0 auto;white-space:normal;padding:8px 20px;color:#333;font-size:14px;max-width:100%;min-height:1.5em;line-height:2em;font-family:微软雅黑;text-align:justify;word-wrap:break-word!important;background-image:-webkit-linear-gradient(left,#eeece1,#92d050);background-color:#eeece1"><span style="margin:0;padding:0;font-size:32px;color:#fff"><strong style="color:#3c752d"><span style="margin:0;padding:0;font-size:14px;line-height:25px">左右渐变</span></strong></span><span style="margin:0;padding:0;color:#494429"></span></p><p><br></p>
    </li>
    <li>
        <p style="margin:0 auto;padding:8px 20px;font-size:14px;white-space:normal;max-width:100%;min-height:1.5em;line-height:2em;font-family:微软雅黑;text-align:justify;color:#494429;word-wrap:break-word!important;background-image:-webkit-linear-gradient(left,#f79646,#eeece1);background-color:#eeece1"><span style="color:#fff"><strong><span style="margin:0;padding:0;font-size:24px"><span style="font-family:微软雅黑;font-size:14px;text-align:justify;margin:0;padding:0;line-height:32px">右</span><span style="font-family:微软雅黑;font-size:14px;line-height:28px;text-align:justify">左渐变</span></span></strong></span></p><p><br></p>
    </li>
    <li>
        <p style="margin:0 auto;padding:8px 20px;color:#333;font-size:14px;white-space:normal;max-width:100%;min-height:1.5em;line-height:2em;font-family:微软雅黑;text-align:justify;word-wrap:break-word!important;background-image:-webkit-linear-gradient(bottom,#c09eae,#c22b4c);background-color:#7e722f"><span style="color:#fff"><strong style="color:#3c752d"><span style="margin:0;padding:0;font-size:14px;line-height:25px">从下到上</span></strong><strong style="color:#3c752d"><span style="margin:0;padding:0;font-size:14px;line-height:25px"></span></strong></span></p><p><br></p>
    </li>
    <li>
        <p style="margin:0 auto;padding:8px 20px;font-size:14px;white-space:normal;max-width:100%;min-height:1.5em;line-height:2em;font-family:微软雅黑;text-align:justify;color:#494429;word-wrap:break-word!important;background-image:-webkit-linear-gradient(top,#f8f5f7,#c22b4c);background-color:#7e722f"><span style="margin:0;padding:0;max-width:100%;font-size:32px;color:#fff;word-wrap:break-word!important"><strong style="color:#3c752d;max-width:100%;word-wrap:break-word!important"><span style="margin:0;padding:0;max-width:100%;font-size:14px;color:#fff;word-wrap:break-word!important;line-height:25px">从上到下，圆润</span></strong></span></p><p><br></p>
    </li>
    <li>
        <p><img style="HEIGHT: auto !important; WIDTH: auto" src="http://mmbiz.qlogo.cn/mmbiz/mj9u1OBZRqP8EvePIzqrRIHCHOzYM4ngNYsOg8QfUOemRM3xnyJlmsR9X8BLgvaDGMKEECmlHHw9pviaGbR2Z7w/0/mmbizgif"></p>
    </li>
    <li>
        <p><img style="HEIGHT: auto !important; WIDTH: auto" src="http://mmbiz.qlogo.cn/mmbiz/mj9u1OBZRqP8EvePIzqrRIHCHOzYM4ngdhk4ZEYb7aYaCSG6jndVEdYsDmg30LywQSO7mhJumK3RPHEP1vyO3g/0/mmbizgif"></p>
    </li>
    <li>
        <p><img style="HEIGHT: auto !important; WIDTH: auto" src="http://mmbiz.qlogo.cn/mmbiz/mj9u1OBZRqP8EvePIzqrRIHCHOzYM4ngnrR7fQGTzR1Ep4h3TplNHSnJhThzlsTUpvR7E8OvptIKpBwWFA1Fgg/0"></p>
    </li>
    <li>
        <p><img style="HEIGHT: auto !important; WIDTH: auto" src="http://mmbiz.qlogo.cn/mmbiz/mj9u1OBZRqP8EvePIzqrRIHCHOzYM4ngAqkiaSIXrUgHYsHrlTNt96Bby6LMCrIibsamD7l3NDUunkhib0ibaNMaKw/0/mmbizgif"></p>
    </li>
    <li>
        <p><img style="HEIGHT: auto !important; WIDTH: auto" src="http://mmbiz.qlogo.cn/mmbiz/mj9u1OBZRqP8EvePIzqrRIHCHOzYM4ngr74Oibicn4wb0ZDex662bznH9Uml5BnMaicq6bzmZ39acazpT3HKt5TSQ/0/mmbizgif"></p>
    </li>
    <li>
        <p><img style="HEIGHT: auto !important; WIDTH: auto;" src="http://mmbiz.qlogo.cn/mmbiz/mj9u1OBZRqP8EvePIzqrRIHCHOzYM4ngaw6iaXbSqVJUia6KKvlGjss1oP7C0eQ8LLxhFtMV0u6Qrdib8iaYSSz4BQ/0/mmbizgif"></p>
    </li>
    <li>
        <p><img style="HEIGHT: auto !important; WIDTH: auto;" src="http://mmbiz.qlogo.cn/mmbiz/mj9u1OBZRqP8EvePIzqrRIHCHOzYM4ngx3vmD8DspLUzH6sQ2z7XibicwjJiaibJthJH2n7s2FLK0oR6RAzdiaNIaibg/0"></p>
    </li>
    <li>
        <p><img style="HEIGHT: auto !important; WIDTH: auto;" src="http://mmbiz.qlogo.cn/mmbiz/mj9u1OBZRqP8EvePIzqrRIHCHOzYM4ngmEPrjq9VXHeMXNsYooVlnb6DReia1yu4osngc8d08F4K1dvKtAgkHBQ/0"></p>
    </li>
</ul>